<template>
  <div>
    <home-header :city="areaCity"></home-header>
    <home-swiper :swiperList="swiperList"></home-swiper>
    <icons :list="iconList"></icons>
    <home-recommend :list="recommendList"></home-recommend>
    <home-weekend :list="weekendList"></home-weekend>
  </div>
</template>
<script>
import HomeHeader from "./components/Header";
import HomeSwiper from "./components/Swiper";
import Icons from "./components/Icons";
import HomeRecommend from "./components/Recommend";
import HomeWeekend from "./components/Weekend";
import axios from "axios";
export default {
  name: "home",
  components: {
    HomeHeader,
    HomeSwiper,
    Icons,
    HomeRecommend,
    HomeWeekend
  },
  data() {
    return {
      areaCity: "",
      swiperList:[],
      iconList:[],
      recommendList:[],
      weekendList:[]
    };
  },
  methods: {
    getHomeInfo() {
      axios.get("/api/index.json").then(this.getHomeInfoSucc);
    },
    getHomeInfoSucc(mes) {
      const datas = mes.data;
      if(datas.ret && datas.data){
        this.areaCity=datas.city
        this.swiperList=datas.data.swiperList
        this.iconList=datas.data.iconList
        this.recommendList=datas.data.recommendList
        this.weekendList=datas.data.weekendList

      }
    }
  },
  mounted() {
    this.getHomeInfo();
  }
};
</script>
<style>
</style>
